var express = require('express');
var router = express.Router();
var fs = require('fs')
var path = require('path')

const Vue = require('vue')


/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});

router.get('/generate', () => {

  let title = 'abc'

  let str = ''
  for(var i = 0; i < 100; i++) {
    str += '<li>' + i + '</li>'
  }

  let result = `
    <!DOCTYPE html>
    <html>
      <head>
        <title>${title}</title>
        <link rel='stylesheet' href='/stylesheets/style.css' />
      </head>
      <body>
        <h1>${title}</h1>
        <p>Welcome to ${title}</p>
        <ul>
          ${str}
        </ul>
      </body>
    </html>
  `

  fs.writeFileSync(path.resolve(__dirname, '../public/index.html'), result)
})

router.get('/vue-page', (req, res, next) => {
  const app = new Vue({
    template: `<div>Hello World {{title}}</div>`,
    data: {
      title: 'abc'
    }
  })

  const renderer = require('vue-server-renderer').createRenderer()

  renderer.renderToString(app, (err, html) => {
    if (err) throw err
    res.send(html)
  })
})

module.exports = router;
